<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://displaytag.sf.net" prefix="display"%>
<c:url value="/empleado.html" var="empleado"></c:url>
<html>
<head>
<title>Operarios</title>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<script src="<c:url value="/resources/js/jquery.min.js"/>" type="text/javascript"></script>
<script	src="<c:url value="/resources/js/jquery.displaytag-ajax-1.2.js"/>"	type="text/javascript"></script>
<link rel="stylesheet" href="<c:url value="/resources/css/bootstrap.css"/>" media="screen">
<link rel="stylesheet" href="<c:url value="/resources/css/bootswatch.min.css"/>">
<script src="<c:url value="/resources/js/navegacion.js"/>"></script>

<script type="text/javascript">

	$( function(){
	   $("#bs-component").displayTagAjax();
	})
	
	$(document).ready(
			function() {
								
				$("#buscar_empleado").click(
						function() {$.get("<c:url value='empleado.html'/>", {
								accion : "buscarEmpleado",
								nombre : document.forms["cuerpo"].nombre.value
							},
									function(responseText, status,
											xmlHttpRequest) {
										$('#bs-component').html($('#bs-component',responseText).html());
									})
						});
				
				
				$("#nuevo_empleado").click(
						function() {
							$("#accion").attr("value", "nuevoEmpleado");
							$("form").submit();
						});
				
			});

	
	
	function eliminar(id_empleado,nombre,apellido_paterno,apellido_paterno){
		$.get("<c:url value='empleado.html'/>", {
			accion : "eliminarEmpleado",
			id_empleado : id_empleado
		},
				function(responseText, status,
						xmlHttpRequest) {
					$('#bs-component').html($('#bs-component',responseText).html());
				})
	}
	
</script>

</head>
<body>

	<form id="cabecera" name="cabecera">
		<div class="navbar navbar-default">
			<div class="navbar-collapse collapse navbar-responsive-collapse">
				<ul class="nav navbar-nav">

					<c:forEach var="urlBean" items="${sessionListUrlBean}">
						<li><a onclick="redireccionar('${urlBean.url}')" href="#"><c:out
									value="${urlBean.nombre}" /></a></li>
					</c:forEach>

				</ul>
			</div>
		</div>
	</form>

	<form class="form-horizontal" id="cuerpo" name="cuerpo" action="${empleado}">
		<input type="hidden" id="accion" name="accion" />
		<div class="col-lg-6 col-lg-offset-3">
			<div class="well bs-component">
				<fieldset>
					<legend>Buscar Empleado</legend>
					<div class="form-group">
						<label for="inputNombre" class="col-lg-2 control-label">Nombre</label>
						<div class="col-lg-7">
							<input type="text" class="form-control" id="nombre" name="nombre"
								placeholder="Nombre del operario">
						</div>
						<div class="col-lg-2">
							<button type="button" class="btn btn-primary"
								id="buscar_empleado">Buscar</button>
						</div>
					</div>
					<div class="row">
						<div class="col-lg-12"></div>
					</div>
					<div class="row">
						<div class="col-lg-12">
							<h4 class="list-group-item-heading">Lista de Empleados</h4>
						</div>
					</div>
					<div class="form-group">
						<div class="col-lg-2">
							<button type="button" class="btn btn-primary" id="nuevo_empleado" >Nuevo</button>
						</div>
					</div>

					<div class="row">
						<div class="col-lg-12">
							<div class="bs-component" id="bs-component">

								<c:set var="count" value="0" />
								<display:table name="empleadoListEmpleado" pagesize="10"
									id="empleado" requestURI="/empleado.html"
									class="table table-striped table-hover ">

									<display:column title="#">
										<c:set var="count" value="${count+1}" />
									</display:column>
									<display:column escapeXml="true" property="nombre"
										title="Nombre" />
									<display:column escapeXml="true" property="tipo_doc"
										title="Tipo Doc." />
									<display:column escapeXml="true" property="nro_doc"
										title="Nro. Doc." />
									<display:column>
										<button type="button" class="btn btn-primary" >Modificar</button>
									</display:column>
									<display:column>
										<button type="button" class="btn btn-warning"  onclick="eliminar('${empleado.id_empleado}','${empleado.nombre}','${empleado.apellido_paterno}','${empleado.apellido_paterno}')">Eliminar</button>
									</display:column>
								</display:table>

							</div>
						</div>
					</div>
				</fieldset>
			</div>
		</div>


	</form>

</body>
</html>